<template>
  <div>
    <span type="primary" size="mini" @click="tologin">点击登录</span>
    <!-- 登录弹窗 -->
    <van-popup
      v-model="showlogin"
      round
      position="bottom"
      :style="{ height: '58%' }"
    >
      <Login v-if="showlogin"></Login>
    </van-popup>
    <!-- 注册弹窗 -->
    <van-popup
      v-model="showReg"
      round
      position="bottom"
      :style="{ height: '65%' }"
    >
      <Register v-if="showReg"></Register>
    </van-popup>
    <!-- 忘记密码弹窗 -->
    <van-popup
      v-model="showLossPwd"
      round
      position="bottom"
      :style="{ height: '50%' }"
    >
      <LossPwd v-if="showLossPwd"></LossPwd>
    </van-popup>
  </div>
</template>

<script>
import Login from "../../components/Login&Register/Login.vue";
import LossPwd from "../../components/Login&Register/LossPwd.vue";
import Register from "../../components/Login&Register/Register.vue";
export default {
  components: { Login, Register, LossPwd },
  data() {
    return {
      // 是否显示登录页面
      showlogin: false,
      // 是否显示注册页面
      showReg: false,
      // 是否显示找回密码页面
      showLossPwd: false,
    };
  },
  methods: {
    // 跳转登录
    tologin() {
      this.showlogin = true;
      this.showReg = false;
      // 监听成功登录事件
      this.$eventBus.$on("loginstatus", (data) => {
        this.showReg = true;
        this.showlogin = false;
      //console.log('监听到了');  
      });
      // console.log('我是登录成功监听事件车的下一行代码');
      // 监听注册事件
      this.$eventBus.$on("toReg", (data) => {
        this.showReg = true;
        this.showlogin = false;
      });
      // 监听登录事件
      this.$eventBus.$on("toLogin", (data) => {
        this.showlogin = true;
        this.showReg = false;
        this.showLossPwd = false;
        this.isShow = false;
      });
      // 监听忘记密码事件
      this.$eventBus.$on("lossPwd", (data) => {
        this.showlogin = false;
        this.showLossPwd = true;
      });
    },
  },
};
</script>

<style lang="scss" scoped></style>
